<%@ page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>

<html>
    <head>
		<%@ include file="/WEB-INF/views/include/common.jsp" %>
		<meta name="AUTHOR" content="QroTech Inc." />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="CACHE-CONTROL" content="NO-CACHE">
		<meta http-equiv="PRAGMA" content="NO-CACHE">
		<meta name="ROBOTS" content="NOINDEX, NOFOLLOW">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<title>큐로넷::위치관제시스템</title>
		
		
		<link rel="stylesheet" href="${cssUrl}/header-1.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/fancy_table.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/menu.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/table.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/button.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/secondmenu.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/body.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/search-box.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/Qronet_display_sub4.css" type="text/css" />
		<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
		<link rel="stylesheet" href="${cssUrl}/m-340.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/groupManage_popup_box.css" type="text/css" />
		<link rel="stylesheet" href="${cssUrl}/m-540.css" type="text/css" />
						
		<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
		<script src="${jsUrl}/pagenation.js"></script>
		<script src="${jsUrl}/windowSize.js"></script>
		<script src="${jsUrl}/m-540.js"></script>
		
		
		
		
    </head>
    <body>
    	<div id="overlay" class="overlay" >
    	</div><!-- overlay end -->
    	<div class="headerContent">
	
		<div class="pageHeader">
			<%@ include file="/WEB-INF/views/include/logoLink.jsp" %>
			<div id="pageNav">
				<ul>
				<%@ include file="/WEB-INF/views/include/mainNaviStyle2.jsp" %>
					<!-- <a href="m-100.html" class="togglerHeader"><li class="hmenu0" id="hdmenu0"></li></a>
					<a href="#" class="togglerHeader"><li class="hmenu1" id="hdmenu1"></li></a>
					<a href="m-300.html" class="togglerHeader"><li class="hmenu2" id="hdmenu2"></li></a>
					<a href="m-400.html" class="togglerHeader"><li class="hmenu3" id="hdmenu3"></li></a>
					<a href="m-500.html" class="togglerHeader"><li class="hmenu4" id="hdmenu4"></li></a> -->
				</ul>
			</div>
			<div id="pageNavRight">
				<%@ include file="/WEB-INF/views/include/titleLink.jsp" %>
			</div>
		</div>
			<div class="header_line"></div>
		</div><!--header end-->	
		<div class="secondMenu" >
			<div id="menu">
				<%@ include file="/WEB-INF/views/include/m500innerNavi.jsp" %>
			</div>
		</div><!-- second menu end -->
        
        	
		
		<div class="mainContent">	
			<div class="searchInfo">
					<ul>
						<li class= "locationInfo"><span>고객사관리</span></li>
					</ul>
					
			</div><!-- searchInfo end -->	
	        <div class="m510">
	        	<div class="sub4_1_content">
    				<div class="table_wrapper">	
    					<div class="m510-info-text m540-info-text">
			        		<ul>
			        			<li>
			        				<ul class="search-autocomplete-box">
			        					<li>
			        						<select name="searchType" id="searchType">
							        			<option value=1>회사명</option>
							        			<option value=2>회사코드</option>
							        			<option value=3>관리자명</option>
							        			<option value=4>전화번호</option>
							        			<option value=5>사업자번호</option>
							        			<option value=6>차량번호</option>
							        			<option value=7>단말기번호</option>
						        			</select>
			        					<li class="autocomplete">
			        						<input type="text" name="searchName" id="searchName" onKeyup="getSearchName(this.value);" autocomplete="off">
						        		</li>
			        					<li>&nbsp;<a onClick="getCompanyList()"><img src="${imgUrl}/black_box.png" style="vertical-align: top;"></a></li>
			        				</ul>
			        			</li>
			        			
			        			<li>
			        				<label>정렬:</label>
			        			<select name="orderBy" onChange="getCompanyList()">
				        			<option value="customerName">회사명</option>
				        			<option value="subscriptionDate">등록일</option>
				        			<option value="officer">관리자명</option>
				        			<option>가입서비스</option>
				        			<option value="addressComponent4">시도</option>
			        			</select>
			        			</li>
			        			<li style="margin-left:10px;">
			        				<input type="checkbox" value="y" id="closeCustomerYn" onClick="getCompanyList();"><span>해지고객 포함</span>
			        			</li>
			        			<li class="last">
			        				<a class="button1 add-button1 popup_open" style="margin-right:0;" rel="1">새 회사 등록</a>
			        				
			        			</li>
			        		</ul>
	        			</div>
    					<table class="sub4_table" cellpadding="0" cellspacing="0" id="companyList">
    						<thead>
    							<tr>
    								<th width="70px">번호</th>
    								<th width="100px">대리점</th>
    								<th width="100px">회사명</th>
    								<th width="100px">회사코드</th>
    								<th width="100px">회사구분</th>
    								<th width="100px">관리자명</th>
    								<th width="100px">시도</th>
    								<th width="100px">전화번호</th>
    								<th width="100px">가입서비스</th>
    								<th width="70px">가입차량대수</th>
    								<th width="70px">가입일</th>
    								<th width="70px">해지일</th>
    								
    							</tr>
    						</thead>	
    						<tbody>
    							<tr onclick="gotoM541(this,0);" class="pointer">
    								<td width="70px" id="seq">1</td>
	    							<td width="100px" id="agentName"></td>
	    							<td width="100px" id="customerName"></td>
	    							<td width="100px" id="customerCode"></td>
	    							<td width="100px" id="customerType"></td>
	    							<td width="100px" id="officer"></td>
	    							<td width="100px" id="addressComponent4"></td>
	    							<td width="100px" id="phone"></td>
	    							<td width="100px" id="serviceName"></td>
	    							<td width="70px" id="regiCarCnt"></td>
	    							<td width="70px" id="subscriptionDate"></td>
	    							<td width="70px" id="closingDate"></td>	    							
    							</tr>
    						</tbody>
    					</table>
    				</div><!--table wrapper-->
    				<div class="pagenation" id="pagenation"><%-- <a><img src="${imgUrl}/page_left_arrow.png"></a>
    					<a>1</a><a>2</a><a>3</a><a>4</a><a>5</a><a>6</a>
    					<a>7</a><a>8</a><a>9</a><a>10</a>
    					<a><img src="${imgUrl}/page_right_arrow.png"></a>  --%>
    				</div>
    			</div>
    		</div>
    		<div class="searchBox">
				<div class="table_wrapper" style="display:none;">
					<table cellpadding="0" cellspacing="0">
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					<tr><td>1234-1234</td></tr>
					<tr><td>이병철</td></tr>
					
					</table>
				</div>
			</div>	
	       	</div> <!-- mainContent end -->
		
		<div class="chart_footer">
		    <div class="footerCenter">
		       <span>Copyright ⓒ 2013 Qrotech Co.,Ltd. All rights reserved.</span>
		    </div>
	 	</div>	<!-- footer end-->	
	 
	 
	<div class="m340_popup4" id="popup1">
				<div class="groupManage_popup_box" >
					<div class="tableTitleA ">새회사 등록<img class="popup_close" src="${imgUrl}/popup_close.png"></div>
						<div class="content">
							<div class="map_table">
							<form name="theForm" id="theForm">
								<table class="content1" cellpadding="0" cellspacing="0"> 
									<tr valign="top" >
										<th>회사명</th>
										<td>
											<input type="text" name="customerName" id="inputCustomerName">
										</td>
									</tr>
									<tr valign="top">
										<th>사업자번호</th>
										<td><input style="width:40px; margin-left:2px;" maxlength="3" name="companyRegNum1" id="inputCompanyRegNum1" type="text">-<input style="width:20px;" maxlength="2" type="text" name="companyRegNum2" id="inputCompanyRegNum2">-<input style="width:46px;" maxlength="5" type="text" name="companyRegNum3" id="inputCompanyRegNum3">&nbsp;<a class="button1 small-button" onClick="getDupCheck(1)">중복확인</a>
										<input type="hidden" name="companyRegNum" id="inputCompanyRegNum"></td>
									</tr>
									<tr valign="top" >
										<th>관리자 명</th>
										<td><input type="text" name="name" id="inputName"></td>
									</tr>
									<tr valign="top" >
										<th>관리자 아이디</th>
										<td><input type="text" name="officerID" id="inputOfficerID">&nbsp;<a href="#" class="button1 small-button" onClick="getDupCheck(2)">중복확인</a>
											
										</td>
									</tr>
									
									<tr valign="top" >
										<th>비밀번호</th>
										<td><input type="password" name="loginPW" id="loginPW"></td>
									</tr>
									<tr valign="top" >
										<th>비밀번호확인</th>
										<td><input type="password" name="loginPW1" id="loginPW1"></td>
									</tr>
									
									<tr valign="top" >
										<th>가입일</th>
										<td><input type="text" id="inputSubscriptionDate" class="datepicker" />
											<input type="hidden" name="subscriptionDate" id="realSubscriptionDate" />
										</td>
									</tr>
									<input type="hidden" name="companyRegNumCheckYn" value="" id="companyRegNumCheckYn" />
									<input type="hidden" name="idCheckYn" value="" id="idCheckYn" />
								</table>
							</form>
							</div>
						
					<br>
					<div class="Rowbtn2" ><a class="button2" onClick="registCompany()">저장하고 상세정보 입력</a><a class="button2" onClick="popupClose()">취소</a></div>
				</div><!-- content end-->	
			</div>	<!--groupManage_popup_box4-->
		</div>	<!--m340_popup4-->
		
	<form id="paramForm" id="paramForm" method="post" style="display:none;">
		<input type="hidden" name="customerCode" id="paramCustomerCode"/>		
	</form>		
	<script language="javascript">
		var _this = this;
		$(document).ready(function(){			
			init();
		});
		
		
		var _this = this;
	    var markerSetting = {
	    		paging:{}
	    }
	    function init() {
	    	markerSetting.paging.page = '<c:out value="${totalPage.page}"/>';
			markerSetting.paging.totalPage ='<c:out value="${totalPage.totalPage}"/>';
			markerSetting.paging.nowSeq = 1;
			
			getCompanyList();
	    }
		function getCompanyList() {
			_this.companyList = tableSync('companyList');
			var url='adminCompanyList.json';
			
			markerSetting.paging.searchType = $("select[name=searchType]").val();
	    	markerSetting.paging.searchName = $("#searchName").val();
	    	if ($("#closeCustomerYn").is(":checked")) {
		    	markerSetting.paging.closeCustomerYn = $("#closeCustomerYn").val();
	    	} else {
	    		markerSetting.paging.closeCustomerYn = 'n';
	    	}
	    	markerSetting.paging.orderBy = $("select[name=orderBy]").val();
	    	var param=markerSetting.paging;
			var closingDate = "", customerType = "";
			AjaxPost(url, param, function(data){
				$.each(data.companyList,function(index, value){
					value.subscriptionDate = formatter.dateFormatYYMMDDHHMM2(new Date(value.subscriptionDate));
					
					closingDate = value.closingDate;
					if(closingDate > 0)
						value.closingDate = formatter.dateFormatYYMMDDHHMM2(new Date(closingDate));
					else
						value.closingDate = '';
					
					customerType = value.customerType;
					if(customerType == 1) {
						value.customerType = "본사";
					} else if(customerType == 2) {
						value.customerType = "대리점";
					} else {
						value.customerType = "고객";
					}
				});				
				_this.companyList.tableAutoSync(data.companyList);
				markerSetting.paging.totalPage= data.totalPage.totalPage;
				makePaging();
			});
		}
		
		function makePaging() {
		    	$('#pagenation').html("");
				var totalPage = markerSetting.paging.totalPage;
				var nowPage = markerSetting.paging.page;
				var html='';
				var setFunctionName='';
				var index=(nowPage-10);
				var indexCount=0;
				
				var endPage = totalPage / 10;
				if (totalPage % 10 > 0) {
					endPage = endPage + 1;
				}
				if(index>1){
					html+='<a onclick="changePaging('+index+',\'before\''+')"><img src="${imgUrl}/page_left_arrow.png"/></a>';
				}
//		 		//logs('totalPage/20 = '+totalPage/20);
				for(;index<=endPage;index++){
					if((index)==nowPage){
						setFunctionName='';
					}else{
						setFunctionName=' onclick="changePaging('+index+')"';
					}
					
					if(index>0){
							
						html+='<a '+setFunctionName+'>'+index+'</a>';	
						
						indexCount++;
					}
					if(indexCount>9){
						html+='<a onclick="changePaging('+index+',\'after\''+')"><img src="${imgUrl}/page_right_arrow.png"/></a>';
						break;
					}
					
				}
				$('#pagenation').html(html);
		}
		
		function popupClose() {
			$('#overlay').css('display', 'none');
			$('#popup1').hide();
		}
		
		function getDupCheck(type) {
			//type == 1 사업자번호
			//type == 2 관리자 아이디
			try{
	    		var url="getDupCheck.json";
	    		var param = "";
	    		if(type == 1) {
	    			param = "companyRegNum="+$("#inputCompanyRegNum1").val()+"-"+$("#inputCompanyRegNum2").val()+"-"+$("#inputCompanyRegNum3").val();	
	    		} else if (type == 2) {
	    			param = "loginID="+$("#inputOfficerID").val();
	    		}
	    		param += "&type="+type;
	    		AjaxPost(url, param, function(data){
    				 if(data.cnt == 0) {
    					 alert('사용 가능합니다.');
    					 if(type==1) {					 
    						 $("#companyRegNumCheckYn").val("n");
    					 } else {
    						 $("#idCheckYn").val("n");
    					 }
    				 } else {
    					 alert('이미 사용중입니다.');
    					 if(type==1) {					 
    						 $("#companyRegNumCheckYn").val("y");
    					 } else {
    						 $("#idCheckYn").val("y");
    					 }
    				 }
	    		});
	    	}catch(e){
	    		//logs(e);
	    	}
		}
		function registCompany() {
			if($("#inputCustomerName").val() == '') {
				alert('회사명을 입력하세요.');
				return;
			}
			
			if($("#inputOfficerID").val() == '') {
				alert('관리자 아이디를 입력하세요.');
				return;
			}
			
			if($("#inputName").val() == '') {
				alert('관리자명을 입력하세요.');
				return;
			}
			
			if($("#companyRegNumCheckYn").val() == '') {
				alert('사업자번호 중복체크를 하세요.');
				return;
			} else if($("#companyRegNumCheckYn").val() == 'y') {
				alert('사업자번호를 확인하세요.');
				return;
			}
			
			if($("#idCheckYn").val() == '') {
				alert('관리자ID를 중복체크를 하세요.');
				return;
			} else if($("#idCheckYn").val() == 'y') {
				alert('관리자ID를 확인하세요.');
				return;
			}
			
			if($("#inputCompanyRegNum1").val() == '' || $("#inputCompanyRegNum2").val() == ''|| $("#inputCompanyRegNum3").val()=='') {
				alert('사업자번호를 입력하세요.');
				return;
			} else {
				$("#inputCompanyRegNum").val($("#inputCompanyRegNum1").val()+"-"+$("#inputCompanyRegNum2").val()+"-"+$("#inputCompanyRegNum3").val());
			}
			
			if($("#loginPW").val() == '') {
				alert('패스워드를 입력하세요.');
				return;
			}
			
			if($("#loginPW").val() != $("#loginPW1").val()) {
				alert('패스워드가 다릅니다.');
				return;
			}
			
			if($("#inputSubscriptionDate").val() == '') {
				alert('가입일을 입력하세요.');
				return;
			} else {				
				var year = $("#inputSubscriptionDate").val().split("-")[0];
				var month = $("#inputSubscriptionDate").val().split("-")[1]-1;
				var day = $("#inputSubscriptionDate").val().split("-")[2];
				
				var hour = formatter.timeFormatHHMMSS(new Date()).split(":")[0];
				var minute = formatter.timeFormatHHMMSS(new Date()).split(":")[1];
				var second = formatter.timeFormatHHMMSS(new Date()).split(":")[2];
				$("#realSubscriptionDate").val(new Date(year, month, day, hour, minute, second)); 
			}
			
			try{
	    		var url="registCompany.json";
	    		var param = $("#theForm").serialize();
	    		AjaxPost(url, param, function(data){
    				 registUser();
	    		});
	    	}catch(e){
	    		//logs(e);
	    	}
		}
		
		function registUser() {
			try{
	    		var url="getCompanyInfo.json";
	    		var param = "officerID="+$("#inputOfficerID").val();
	    		var customerCode = 0;
	    		AjaxPost(url, param, function(data){
    				 customerCode = data.companyInfo['customerCode'];
    				 
    				 url = "registUser.json";
    		    		param = {};
    		    		param['customerCode'] = customerCode;
    		    		param['loginID'] = $("#inputOfficerID").val();
    		    		param['loginPW'] = $("#loginPW").val();
    		    		param['name'] = $("#inputName").val();
    		    		AjaxPost(url, param, function(data){
    		    			alert(data.msg);
    		    			$('#theForm')[0].reset();
    		    			popupClose();
    		    			gotoM541(null, customerCode);
    		    		});
	    		});
	    		
	    	}catch(e){
	    		//logs(e);
	    	}
		}
		
		function gotoM541(tr, customerCode) {
			if(customerCode == 0) {
				var customerCode = $(tr).find("#customerCode").text();
			} 
			$("#paramCustomerCode").val(customerCode);
			$("#paramForm").attr("action", "/admin/adminCompanyDetailMain");
			$("#paramForm").submit();
		}
		
		function getSearchName(searchName){			
    	    
   	    	$('#searchName').autocomplete({
   	    		delay:500,
                source:function(request, response){
                	var url="getSearchName.json";
        			
            	    var searchType = $("#searchType option:selected").val();    	    
            	    var param={};
            	    param['searchType'] = searchType;
        			param['searchName'] = searchName;
        			
        			if(searchType == 1 || searchType == 3) {
	                	AjaxPost(url, param, function(data){
	                		response( $.map( data.searchName, function( item ) {
	                			var name="";
		                		if(searchType == 1) {
		                			name = item.customerName;
		                		} else {
		                			name = item.officer;
		                		}
	                            if (name.toLowerCase().indexOf($("#searchName").val().toLowerCase()) >= 0)
	                            {
	                            	return {
	                                  label: name.toLowerCase().replace($("#searchName").val().toLowerCase(),$("#searchName").val().toLowerCase()),
	                                  value: name
	                                }
	                            }
	                      	}));
	                	});
        			}
                },
                select: function (event, ui) {
                    //아이템 선택시 처리 코드
                	getCompanyList();
                },	                
                selectFirst: true,
                minLength: 1,
                open: function () {
                   // $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
                    $('.ui-autocomplete.ui-menu').css('width', '150px');
                },
                close: function () {
                    //$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
                }
   	        });
		}
	</script>
  </body>
</html>
